<template>
  <div class="import-container">
    <el-card>
      <h2>员工导入</h2>
      <el-alert
        title="每次导入仅可添加1000名员工,姓名、手机、入职时间、聘用形式为必填项"
        type="warning"
        show-icon
      />
      <UploadeExcel :on-success="successHandler" class="UploadeExcel" />
    </el-card>
  </div>
</template>

<script>
// 导入 导入接口
import { importEmployees } from '@/api/employees'
// 导入工具函数
import { formatExcelDate } from '@/utils/index'
// 导入组件
import UploadeExcel from '@/components/UploadeExcel'
export default {
  name: 'Import',
  components: {
    UploadeExcel
  },
  methods: {
    async successHandler(data) {
      //   console.log(data)
      /* eslint-disable */
      const newArr = data.results.map(v => {
        v.correctionTime = formatExcelDate(v.correctionTime, '/')
        v.timeOfEntry = formatExcelDate(v.timeOfEntry, '/')
        return { ...v }
      })
      //   console.log(newArr)
      const res = await importEmployees(newArr)
      this.$message.success('批量导入成功！')
      this.$router.push({ path: '/employees' })
    }
  }
}
</script>

<style lang="scss">
.import-container {
  background-color: #ccc;
  padding: 20px;
  .el-card {
    padding: 20px;
    text-align: center;
    .UploadeExcel {
      margin-top: 30px;
    }
  }
}
</style>
